* {
    padding: 0;
    margin: 0
}

.xiang_box {
    width: 100vw;
    height: 100vh;
    // background: skyblue;
    // overflow: auto;
    box-sizing: border-box;
    .xiang_box_all{
        width: 100vw;
        height: calc(100vh - 50px);
        // background: orange;
        overflow: auto;
        overflow-x: hidden;
        box-sizing: border-box;
        .xiang_box_nav {
            width: 100vw;
            height: 50px;
            background: purple;
        }
    
        .xiang_box_img {
            width: 100vw;
            height: 42vh;
            // background: pink;
            padding: 10px;
            box-sizing: border-box;
            img{
                width: 100vw;
                height: calc(42vh - 20px);
            }
        }
    
        .xiang_box_jieshao {
            width: 100vw;
            height: 14vh;
            padding: 5px 10px;
            border-bottom: 1px solid rgb(206, 206, 206);
            box-sizing: border-box;
    
            // background: orange;
            // 第一个p元素
            p:first-child {
                width: 100vw;
                height: 4vh;
                line-height: 4vh;
                font-size: 18px;
                font-weight: 600;
                color: red;
                // padding-left: 10px;
                box-sizing: border-box
            }
    
            // 第二个p元素
            p:nth-child(2) {
                width: 100vw;
                height: 4vh;
                line-height: 4vh;
                font-size: 16px;
                font-weight: 600;
                color: black;
                // padding-left: 10px;
                box-sizing: border-box
            }
    
            // 第三个p元素
            p:nth-child(3) {
                width: 100vw;
                height: 4vh;
                line-height: 4vh;
                font-size: 14px;
                color: rgb(109, 105, 105);
                // padding-left: 10px;
                box-sizing: border-box
            }
        }
    
        .xiang_box_four {
            width: 100vw;
            height: 10vh;
     
            //   background: pink;
            padding: 0 10px;
            box-sizing: border-box;
            display: flex;
            justify-content: space-around;
            align-items: center;
    
            .xiang_box_four_one {
                width: 25vw;
                height: 10vh;
                // background: pink;
                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items: center;
                text-align: center;
    
                p:first-child {
                    width: 20vw;
                    height: 3vh;
                    line-height: 3vh;
                    font-size: 16px;
                    font-weight: 600;
                    color: black;
                }
    
                p:nth-child(2) {
                    width: 20vw;
                    height: 3vh;
                    line-height: 3vh;
                    font-size: 14px;
                    color: rgb(109, 105, 105);
                }
            }
            .xiang_box_four_two{
                width: 25vw;
                height: 10vh;
                // background: pink;
                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items: center;
                text-align: center;
    
                p:first-child {
                    width: 20vw;
                    height: 3vh;
                    line-height: 3vh;
                    font-size: 16px;
                    font-weight: 600;
                    color: black;
                }
    
                p:nth-child(2) {
                    width: 20vw;
                    height: 3vh;
                    line-height: 3vh;
                    font-size: 14px;
                    color: rgb(109, 105, 105);
                }
            }
            .xiang_box_four_three{
                width: 25vw;
                height: 10vh;
                // background: pink;
                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items: center;
                text-align: center;
    
                p:first-child {
                    width: 20vw;
                    height: 3vh;
                    line-height: 3vh;
                    font-size: 16px;
                    font-weight: 600;
                    color: black;
                }
    
                p:nth-child(2) {
                    width: 20vw;
                    height: 3vh;
                    line-height: 3vh;
                    font-size: 14px;
                    color: rgb(109, 105, 105);
                }
            }
            .xiang_box_four_four{
                width: 25vw;
                height: 10vh;
                // background: pink;
                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items: center;
                text-align: center;
    
                p:first-child {
                    width: 20vw;
                    height: 3vh;
                    line-height: 3vh;
                    font-size: 16px;
                    font-weight: 600;
                    color: black;
                }
    
                p:nth-child(2) {
                    width: 20vw;
                    height: 3vh;
                    line-height: 3vh;
                    font-size: 14px;
                    color: rgb(109, 105, 105);
                }
            }
        }
        .xiang_box_grey{
            width: 100vw;
            height: 2vh;
            background: rgb(222, 221, 221);
        }
        .xiang_box_pingjia{
            width: 100vw;
            // background: palevioletred;
            .ping{
                width:100vw;
                padding: 0 10px;
                box-sizing: border-box;
                height: 40px;
                line-height: 40px;
                display: flex;
                justify-content: space-between;
                // 第一个span
                span:first-child{
                    font-size: 16px;
                    color: black;
                    font-weight: 600;
                }
                // 第二个span
                span:nth-child(2){
                    font-size: 14px;
                    color: rgb(109, 105, 105);
                }
            }
            .user_pingjia_box{
                width: 100vw;
                padding: 10px;
                box-sizing: border-box;
                border-bottom: 1px solid rgb(222, 221, 221);
            }

        }
        .xiang_box_xiangqing{
            width: 100vw;
            padding: 0 10px;
            box-sizing: border-box;
        }

    }
  
    .demo-action-bar{
        width: 100vw;
        height: 50px;
        background: skyblue;
    }
}